<form [formGroup]="checkboxGroupForm">
  <div class="btn-group" data-toggle="buttons">
    <label class="btn btn-primary" [class.active]="checkboxGroupForm.value.left">
      <input type="checkbox" formControlName="left"> Left (pre-checked)
    </label>
    <label class="btn btn-primary" [class.active]="checkboxGroupForm.value.middle">
      <input type="checkbox" formControlName="middle"> Middle
    </label>
    <label class="btn btn-primary" [class.active]="checkboxGroupForm.value.right">
      <input type="checkbox" formControlName="right"> Right
    </label>
  </div>
</form>
<hr>
<pre>{{checkboxGroupForm.value | json}}</pre>
